<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>viewpage</title>
    <link rel="stylesheet" href="../../model/view.css">
</head>
<body>
<div class="catalog">
    <h2>目录</h2>
    <ul>
        <li>
            <p><a href="#element">< viewpage ></a></p>
        </li>
        <li>
            <p><a href="#style">类型</a></p>
            <ul id="catalog_style">

            </ul>
        </li>
    </ul>
</div>
<div id="element">
    <h2>accrodion</h2>
    <div>简介:</div>
    <p>可以嵌套多个控件</p>
</div>
<div id="style"></div>
<div></div>
<script src="../../js/script_min.js"></script>
<script src="../../model/view.js"></script>
<script>
    let viewpage = new view("viewpage");
    viewpage.init([
        {style:1,data:[
            {img:"img/viewpage.png",code:`<viewPage height="400">
            <page>
                <group num="3">
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                </group>
            </page>
            <page>
                <group num="3">
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                    <button>
                        <img radius="40" attr="80,80" src="https://timgsa.baidu.com/timg?image&amp;quality=80&amp;size=b9999_10000&amp;sec=1532520562161&amp;di=cb53381a9019216d062926de54fb5701&amp;imgtype=0&amp;src=http%3A%2F%2Fcomic.people.com.cn%2FNMediaFile%2F2014%2F1219%2FMAIN201412191006000280747316081.jpg"/>
                        <bp >bp</bp>
                    </button>
                </group>
            </page>
        </viewPage>`,title:"经典款"},

        ]},

    ]);
</script>
<div class="author"><p>by-姜进</p></div>
</body>
</html>